<html>
<meta charset="utf-8">

<head>
    <script src="jquery-3.2.1.min.js"></script>
    <script>
        $(function () {
            $('button:first').click(function () {
                var targElement = $('#targ').siblings();
                targElement.addClass('brother_class');
            });
            $('button:eq(1)').click(function () {
                var targElement = $('#targ').siblings('.test');
                targElement.addClass('brother_class');
            });
            $('button:eq(2)').click(function () {
                var targElement = $('#targ').next();
                targElement.addClass('brother_class');
            });
            $('button:eq(3)').click(function () {
                var targElement = $('#targ').nextAll();
                targElement.addClass('brother_class');
            });
            $('button:eq(4)').click(function () {
                var targElement = $('ul').nextUntil('br');
                targElement.addClass('brother_class');
            });
            $('button:eq(5)').click(function () {
                var targElement = $('#targ').prev();
                targElement.addClass('brother_class');
            });
            $('button:eq(6)').click(function () {
                var targElement = $('#targ').prevAll();
                targElement.addClass('brother_class');
            });
            $('button:eq(7)').click(function () {
                var targElement = $('#targ').prevUntil('.test');
                targElement.addClass('brother_class');
            });
        });
    </script>
    <style>
        .brother_class {
            border: 3px solid red;
            padding: 2px;
        }

        .test {
            color: blue;
        }
    </style>
</head>
<div>
    <ul>
        <li>siblings()</li>
        <li class="test">next()</li>
        <li>nextAll()</li>
        <li>nextUntil()</li>
        <li id='targ'><b>prev()</b></li>
        <li>
            <u>prevAll()</u>
        </li>
        <li><i>prevUntil()</i></li>
    </ul>
    <button>查找所有同级元素siblings()</button>
    <button>根据条件查找所有同级元素siblings('.test')</button>
    <br><br>
    <button>查找同级下个个元素（只返回一个）next()</button>
    <button>查找同级后面所有元素（返回所有）nextAll()</button>
    <button>查找同级后面所有元素直到xx位置（返回所有区间）nextUntil('br')</button>
    <br><br>
    <button>查找同级上一个元素（只返回一个）prev()</button>
    <button>查找同级前面所有元素（返回所有）prevAll()</button>
    <button>查找同级前面所有元素直到xx位置（返回所有区间）prevUntil('.test')</button>
</div>

</html>